Page({
  data: {
    longitude: 0,
    latitude: 0,
    markers: []
  },
  // 页面加载
  onLoad() {
    // 获取当前定位
    wx.getLocation({
      type: 'gcj02',
      success: (res) => {
        console.log(res)
        this.setData({
          longitude: res.longitude,
          latitude: res.latitude,
          markers: [ // 设置定位点
            {
              iconPath: "/resources/pin.png",
              id: 1,
              latitude: res.latitude,
              longitude: res.longitude,
              width: 22,
              height: 31,
              zIndex: 99
            }
          ]
        })

        // 获取周围宠物交易信息
        this.getTradeInfo()
      }
    })
    // 创建 MapContext 对象
    this.mapContext = wx.createMapContext('pet-map', this)
  },

  // 获取周围宠物交易信息的标记点
  getTradeInfo() {
    wx.request({
      url: 'http://rap2api.taobao.org/app/mock/224284/api/v1/pet/trade',
      success: res => {
        console.log(res)
        // 将响应数据映射为 markers
        const markers = res.data.data.list.map(item => {
          return {
            iconPath: item.type === 'buy' ? '/resources/buy.png' : '/resources/sell.png',
            id: item.id,
            latitude: item.latitude,
            longitude: item.longitude,
            width: 20,
            height: 20
          }
        })
        // 设置 data 中的 markers 数据 
        this.setData({
          markers: this.data.markers.concat(markers)
        })
      }
    })
  },
  // 回到地图定位的中心点
  backToCenter() {
    // 使用 MapContext 对象
    this.mapContext.moveToLocation()
  },
  // 设置分享
  onShareAppMessage() {
    return {
      title: '萌宠交易平台',
      path: '/pages/index/index'
    }
  },
  // 点击标记时处理函数
  markerTapHandler(e) {
    const id = e.markerId
    wx.navigateTo({
      url: '/pages/detail/index?id=' + id,
    })
  }
})